<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>自定义事件并且主动触发</title>
</head>
<body>
<div id="div1">div</div>
<span id="span1">span</span>
</body>
<script>

    var oDiv = document.getElementById('div1');
    var oSpan = document.getElementById('span1');
    bindEvent(oDiv , 'click',function(){
        alert(3);
    });
    bindEvent(oSpan , 'gogo',function(){
        alert(4);
    });
    fireEvent(oSpan , 'gogo');  //3 , 4
    function bindEvent(obj,events,fn){
        obj.listeners = obj.listeners || {};
        obj.listeners[events] = obj.listeners[events] || [];
        obj.listeners[events].push( fn );
        if(obj.addEventListener){
            obj.addEventListener(events,fn,false);
        }
        else{
            obj.attachEvent('on'+events,fn);
        }
    }
    //主动触发自定义事件
    function fireEvent(obj,events){
        for(var i=0;i<obj.listeners[events].length;i++){
            obj.listeners[events][i]();
        }
    }
</script>
</html>